import React, {useEffect} from "react";
import {
  Modal,
  Form,
  Select,
  DatePicker,
  Row,
  Space,
  Radio,
  notification,
} from "antd";
import {useRequest} from "ahooks";
import {
  getPredicateTableListExport,
  getSummaryTableListExport,
} from "@/services/report";
import moment from "dayjs";
import {getCurrentUser} from "@/utils/authority";

const holidays = [
  "国庆节",
  "中秋节",
  "端午节",
  "劳动节",
  "清明节",
  "春节",
  "元旦",
];
const CreateReportModal: React.FC<any> = ({
                                            dispatch,
                                            onSuccess,
                                            ...modalProps
                                          }: any) => {
  const [form] = Form.useForm();
  const user = getCurrentUser();

  const {run, loading: spinning} = useRequest(
    ({type, ...params}: any) =>
      type == 1
        ? getPredicateTableListExport(params)
        : getSummaryTableListExport(params),
    {
      manual: true,
      onSuccess() {
        notification.success({
          message: "生成成功",
        });
        dispatch({
          visible: false,
        });
      },
      onFinally(params, data, e) {
        if (typeof e === "string") {
          notification.success({
            message: "生成成功",
          });
          dispatch({
            visible: false,
          });
          onSuccess && onSuccess();
        }
      },
    }
  );
  const submit = async () => {
    const {halfYear, halfHoliday, date, ...values} =
      await form.validateFields();
    if (values.scope === "year") {
      values.dateStr = moment(date).format("YYYY");
    }
    if (values.scope === "month") {
      values.dateStr = moment(date).format("YYYY-MM");
    }
    if (values.scope === "quarter") {
      values.dateStr = moment(date).format("YYYY-Q");
    }
    if (values.scope === "half_year") {
      values.dateStr = moment(date).format("YYYY") + halfYear;
    }
    if (values.scope === "holiday") {
      values.dateStr = `${moment(date).format("YYYY")}-${halfHoliday}`;
    }
    if (values.scope === "custom") {
      if (date?.length > 0) {
        values.dateStr = `${moment(date[0]).format("YYYY-MM-DD")},${moment(
          date[1]
        ).format("YYYY-MM-DD")}`;
      }
    }
    run({
      ...values,
      zoneCode: user?.zoneCode,
      scope: values.scope.toUpperCase(),
    });
  };
  useEffect(() => {
    form.setFieldsValue({
      type: '1'
    })
  }, [])
  return (
    <Modal {...modalProps} onOk={submit} confirmLoading={spinning}>
      <Form form={form}>
        <Form.Item
          label="报告主题"
          name="type"
          rules={[
            {
              required: true,
              message: "请选择报告主题",
            },
          ]}
        >
          <Radio.Group>
            <Radio value="1">节前研判</Radio>
            <Radio value="2">节后总结</Radio>
          </Radio.Group>
        </Form.Item>
        <Form.Item
          dependencies={['type']}
        >
          {({getFieldValue}) => {
            const type = getFieldValue('type');
            console.log('type', type);
            return <Form.Item
              label="时间类型"
              name="scope"
              rules={[
                {
                  required: true,
                  message: "请选择时间类型",
                },
              ]}
            >
              <Radio.Group>
                {
                  type === '1' ? <>
                    <Radio value="holiday">节假日</Radio>
                    <Radio value="custom">自定义时间段</Radio>
                  </> : ''
                }
                {
                  type === '2' ? <>
                    <Radio value="year">年</Radio>
                    <Radio value="month">月</Radio>
                    <Radio value="quarter">季度</Radio>
                    <Radio value="holiday">节假日</Radio>
                    <Radio value="custom">自定义时间段</Radio>
                  </> : ''
                }

              </Radio.Group>
            </Form.Item>
          }}
        </Form.Item>
        <Space>
          <Form.Item noStyle dependencies={["scope"]}>
            {() => {
              const scope = form.getFieldValue("scope");
              const dateMap: any = {
                year: <DatePicker picker="year"/>,
                month: <DatePicker picker="month"/>,
                quarter: <DatePicker picker="quarter"/>,
                half_year: <DatePicker picker="year"/>,
                holiday: <DatePicker picker="year"/>,
                custom: <DatePicker.RangePicker/>,
              };
              return (
                <Form.Item
                  label="时间"
                  name="date"
                  rules={[
                    {
                      required: true,
                      message: "请选择时间",
                    },
                  ]}
                >
                  {(scope && dateMap[scope]) || <DatePicker picker="year"/>}
                </Form.Item>
              );
            }}
          </Form.Item>

          <Form.Item noStyle dependencies={["scope"]}>
            {() => {
              const scope = form.getFieldValue("scope");
              const dateMap: any = {
                year: "",
                month: "",
                quarter: "",
                half_year: (
                  <Form.Item
                    name="halfYear"
                    rules={[
                      {
                        required: true,
                        message: "请选择时间",
                      },
                    ]}
                  >
                    <Select
                      style={{width: "140rem"}}
                      options={[
                        {
                          label: "上半年",
                          value: "年上半年度",
                        },
                        {
                          label: "下半年",
                          value: "年下半年度",
                        },
                      ]}
                    />
                  </Form.Item>
                ),
                holiday: (
                  <Form.Item
                    name="halfHoliday"
                    rules={[
                      {
                        required: true,
                        message: "请选择时间",
                      },
                    ]}
                  >
                    <Select
                      style={{width: "140rem"}}
                      options={holidays.map((item: any) => ({
                        label: item,
                        value: item,
                      }))}
                    />
                  </Form.Item>
                ),
              };
              return dateMap[scope] || "";
            }}
          </Form.Item>
        </Space>
      </Form>
    </Modal>
  );
};

export default CreateReportModal;
